import { onMounted, ref, onBeforeUnmount } from 'vue'
export default () => {
    /* 滚动 
    1、隐藏
    2、当窗口滚动200px 完全显示
     */
    let opacity = ref(0);
    /* 全局事件的监听和解绑 */
    onMounted(() => {
        window.addEventListener("scroll", handleScroll)
    })
    /* 离开页面需要对全局事件进行解绑 */
    onBeforeUnmount(() => {
        window.removeEventListener("scroll", handleScroll)
    })
    const handleScroll = () => {
        /* 滚动条距离顶部的高度 */
        let height = window.scrollY;
        let value = height / 200;
        console.log(value)
        if (value > 1) {
            value = 1;
        }
        opacity.value = value;
    }
    return {
        opacity
    }
}